var uiu = document.querySelector(".two2")
var soo = document.querySelector(".soo")
var xs = document.querySelector("#xs")
var lol = document.querySelector("#lol")
var pop = document.querySelector(".pop")
var opo = document.querySelector(".opo")
var lkl = document.querySelector("#lkl")
var jk = document.querySelector(".jk")
uiu.onclick = function() {
	soo.style.display = "block"
}
xs.onclick = function() {
	soo.style.display = "none"
}
lol.onclick = function() {
	pop.style.display = "block"
	opo.style.display = "none"
	jk.style.display = "none"
}

lkl.onclick = function() {
	opo.style.display = "none"
	jk.style.display = "block"
}
lol.onkeydown = function(e) {
	if (e.keyCode === 13) {
		opo.style.display = "none"
		jk.style.display = "block"
		pop.style.display = "none"
	}
}
var tyt = document.querySelectorAll(".tyt")
for (var q = 0; q < tyt.length; q++) {
	tyt[q].onclick = function() {
		var lol = document.querySelector("#lol")
		lol.value = this.innerHTML
		pop.style.display = "none"
		opo.style.display = "block"
	}

}

var acts = document.querySelector("#act")
var boxEr = document.querySelector(".box-er")
acts.onmouseover = function() {
	boxEr.setAttribute("style", "display:block;")
}
acts.onmouseleave = function() {
	boxEr.setAttribute("style", "display:none;")
}
var disc = document.querySelector(".disc")
var boxdis = document.querySelector(".box-dis")
disc.onclick = function() {
	boxdis.classList.toggle("hide")
}
var minxi = document.querySelector(".minxi")
var minxis = document.querySelector(".minxis")
var xEle = document.querySelector("#x")
minxi.onclick = function() {
	minxis.classList.toggle("hide")
}
xEle.onclick = function() {
	minxis.classList.add("hide")
}
var one = document.querySelector("#one")
var two = document.querySelector("#two")
one.onclick = function() {
	alert("至少购买一件商品")
}
two.onclick = function() {
	alert("限购一件商品")
}
var three = document.querySelector("#three")
var four = document.querySelector("#four")
var numEle = document.querySelector("#num")
var heji = document.querySelector("#heji")
var one11 = document.querySelector("#one11")
var one22 = document.querySelector("#one22")
var two11 = document.querySelector("#two11")
var asd = document.querySelector("#asd")
var pro = one11.innerHTML * one22.innerHTML
three.onclick = function() {
	if (numEle.innerHTML > 1) {
		numEle.innerHTML--
		var findx5 = two11.innerHTML * numEle.innerHTML
		heji.innerHTML = pro + findx5 - 10
		asd.innerHTML = pro + findx5
	} else {
		alert("至少购买一件商品")
	}
}
four.onclick = function() {
	if (numEle.innerHTML < 2) {
		numEle.innerHTML++
		var findx5 = two11.innerHTML * numEle.innerHTML
		heji.innerHTML = pro + findx5 - 10
		asd.innerHTML = pro + findx5
	} else {
		alert("限购两件商品")
	}
}

var xx = document.querySelector("#xx")
var forms = document.querySelector(".form-bg")
xx.onclick = function() {
	forms.classList.add("hide")
}
var update1 = document.querySelector(".update1")
var update11 = document.querySelector("#update11")
update1.onclick = function() {
	forms.classList.remove("hide")
}
update11.onclick = function() {
	forms.classList.remove("hide")
}

var off = document.querySelector(".off")
off.onclick = function() {
	forms.classList.add("hide")
}


var adds = document.querySelector("#adds")
var reds = document.querySelector("#reds")
adds.onclick = function() {
	alert("限购一件")
}
reds.onclick = function() {
	alert("至少购买一件")
}



var nei = document.querySelector("#nei")
var color = document.querySelector("#color")
var jia = document.querySelector("#jia")
var nei = document.querySelector("#nei")
var bajia = document.querySelector("#bajia")
var sier = document.querySelector("#sier")
var qin = document.querySelector("#qin")
var hui = document.querySelector("#hui")
var hei = document.querySelector("#hei")
var yanyi = document.querySelector("#yanyi")
var yanban = document.querySelector("#yanban")
var sui = document.querySelector("#sui")
var care = document.querySelector("#care")
var yu = document.querySelector("#yu")
var rn8 = document.querySelector("#rn8")
bajia.onclick = function() {
	bajia.style.color = "red"
	bajia.style.border = "1px solid red"
	sier.style.color = "rgba(0, 0, 0, 0.5)"
	sier.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	jia.innerHTML = 3499
	nei.innerHTML = '8 + 256G'
	yu.innerHTML = 3495.12
}
sier.onclick = function() {
	sier.style.color = "red"
	sier.style.border = "1px solid red"
	bajia.style.color = "rgba(0, 0, 0, 0.5)"
	bajia.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	jia.innerHTML = 3999
	nei.innerHTML = '12 + 256G'
}
qin.onclick = function() {
	qin.style.color = "red"
	qin.style.border = "1px solid red"
	hui.style.color = "rgba(0, 0, 0, 0.5)"
	hui.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hei.style.color = "rgba(0, 0, 0, 0.5)"
	hei.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color.innerHTML = qin.innerHTML
	rn8.innerHTML = `<img src="../img/8pro+.png" alt="">`
}
hui.onclick = function() {
	hui.style.color = "red"
	hui.style.border = "1px solid red"
	qin.style.color = "rgba(0, 0, 0, 0.5)"
	qin.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hei.style.color = "rgba(0, 0, 0, 0.5)"
	hei.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color.innerHTML = hui.innerHTML
	rn8.innerHTML = `<img src="../img/8pro+灰.png" alt="">`
}
hei.onclick = function() {
	hei.style.color = "red"
	hei.style.border = "1px solid red"
	qin.style.color = "rgba(0, 0, 0, 0.5)"
	qin.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hui.style.color = "rgba(0, 0, 0, 0.5)"
	hui.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color.innerHTML = hei.innerHTML
	rn8.innerHTML = `<img src="../img/8pro+黑.png" alt="">`
}
yanyi.onclick = function() {
	yanyi.style.color = "red"
	yanyi.style.border = "1px solid red"
	yanban.style.color = "rgba(0, 0, 0, 0.5)"
	yanban.style.border = "1px solid rgba(0, 0, 0, 0.5)"
}
yanban.onclick = function() {
	yanban.style.color = "red"
	yanban.style.border = "1px solid red"
	yanyi.style.color = "rgba(0, 0, 0, 0.5)"
	yanyi.style.border = "1px solid rgba(0, 0, 0, 0.5)"
}
sui.onclick = function() {
	sui.classList.toggle("border1")
}
care.onclick = function() {
	care.classList.toggle("border1")
}

var phone = document.querySelector("#phone")
var wainei = document.querySelector("#wainei")
var wainei1 = document.querySelector("#wainei1")
var waicolor = document.querySelector("#waicolor")
var waicolor1 = document.querySelector("#waicolor1")
var yugu = document.querySelector("#yugu")
var add = document.querySelector(".add")

add.onclick = function() {
	wainei.innerHTML = nei.innerHTML
	phone.innerHTML = rn8.innerHTML
	waicolor.innerHTML = color.innerHTML
	one11.innerHTML = jia.innerHTML
	wainei1.innerHTML = nei.innerHTML
	waicolor1.innerHTML = color.innerHTML
	forms.classList.add("hide")
	yugu.innerHTML = yu.innerHTML
	var pros = one11.innerHTML * one22.innerHTML
	var findx5s = two11.innerHTML * numEle.innerHTML
	heji.innerHTML = pros + findx5s
	three.onclick = function() {
		if (numEle.innerHTML > 1) {
			numEle.innerHTML--
			var findx5s = two11.innerHTML * numEle.innerHTML
			heji.innerHTML = pros + findx5s - 10
			asd.innerHTML = pros + findx5s
		} else {
			alert("至少购买一件商品")
		}
	}
	four.onclick = function() {
		if (numEle.innerHTML < 2) {
			numEle.innerHTML++
			var findx5s = two11.innerHTML * numEle.innerHTML
			heji.innerHTML = pros + findx5s - 10
			asd.innerHTML = pros + findx5s
		} else {
			alert("限购两件商品")
		}
	}
}
var dell = document.querySelectorAll(".dell")
for (var i = 0; i < dell.length; i++) {
	dell[i].onclick = function() {
		this.parentElement.parentElement.remove()
	}
}


var xx1 = document.querySelector("#xx1")
var forms1 = document.querySelector(".form-bg1")
xx1.onclick = function() {
	forms1.classList.add("hide")
}
var update22 = document.querySelector("#update22")
var update2 = document.querySelector(".update2")

update22.onclick = function() {
	forms1.classList.remove("hide")
}
update2.onclick = function() {
	forms1.classList.remove("hide")
}

var off1 = document.querySelector("#off1")
off1.onclick = function() {
	forms1.classList.add("hide")
}


var adds1 = document.querySelector("#adds1")
var reds1 = document.querySelector("#reds1")
adds1.onclick = function() {
	alert("限购一件")
}
reds1.onclick = function() {
	alert("至少购买一件")
}


var nei1 = document.querySelector("#nei1")
var color1 = document.querySelector("#color1")
var jia1 = document.querySelector("#jia1")
var nei1 = document.querySelector("#nei1")
var bajia1 = document.querySelector("#bajia1")
var sier1 = document.querySelector("#sier1")
var qin1 = document.querySelector("#qin1")
var hui1 = document.querySelector("#hui1")
var hei1 = document.querySelector("#hei1")
var yanyi1 = document.querySelector("#yanyi1")
var yanban1 = document.querySelector("#yanban1")
var sui1 = document.querySelector("#sui1")
var care1 = document.querySelector("#care1")
var yu1 = document.querySelector("#yu1")
var rn81 = document.querySelector("#rn81")
bajia1.onclick = function() {
	bajia1.style.color = "red"
	bajia1.style.border = "1px solid red"
	sier1.style.color = "rgba(0, 0, 0, 0.5)"
	sier1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	jia1.innerHTML = 4699
	nei1.innerHTML = '8 + 256G'
	yu1.innerHTML = 4689
}
sier1.onclick = function() {
	sier1.style.color = "red"
	sier1.style.border = "1px solid red"
	bajia1.style.color = "rgba(0, 0, 0, 0.5)"
	bajia1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	jia1.innerHTML = 5499
	nei1.innerHTML = '12 + 256G'
}
qin1.onclick = function() {
	qin1.style.color = "red"
	qin1.style.border = "1px solid red"
	hui1.style.color = "rgba(0, 0, 0, 0.5)"
	hui1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hei1.style.color = "rgba(0, 0, 0, 0.5)"
	hei1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color1.innerHTML = qin1.innerHTML
	rn81.innerHTML = `<img src="../img/findx5pro黑釉.png" alt="">`
}
hui1.onclick = function() {
	hui1.style.color = "red"
	hui1.style.border = "1px solid red"
	qin1.style.color = "rgba(0, 0, 0, 0.5)"
	qin1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hei1.style.color = "rgba(0, 0, 0, 0.5)"
	hei1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color1.innerHTML = hui1.innerHTML
	rn81.innerHTML = `<img src="../img/findx5pro.png" alt="">`
}
hei1.onclick = function() {
	hei1.style.color = "red"
	hei1.style.border = "1px solid red"
	qin1.style.color = "rgba(0, 0, 0, 0.5)"
	qin1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	hui1.style.color = "rgba(0, 0, 0, 0.5)"
	hui1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
	color1.innerHTML = hei1.innerHTML
	rn81.innerHTML = `<img src="../img/findx5pro水蓝.png" alt="">`
}
yanyi1.onclick = function() {
	yanyi1.style.color = "red"
	yanyi1.style.border = "1px solid red"
	yanban1.style.color = "rgba(0, 0, 0, 0.5)"
	yanban1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
}
yanban1.onclick = function() {
	yanban1.style.color = "red"
	yanban1.style.border = "1px solid red"
	yanyi1.style.color = "rgba(0, 0, 0, 0.5)"
	yanyi1.style.border = "1px solid rgba(0, 0, 0, 0.5)"
}
sui1.onclick = function() {
	sui1.classList.toggle("border1")
}
care1.onclick = function() {
	care1.classList.toggle("border1")
}
var phone1 = document.querySelector("#phone1")
var wainei11 = document.querySelector("#wainei11")
var wainei111 = document.querySelector("#wainei111")
var waicolor11 = document.querySelector("#waicolor11")
var waicolor111 = document.querySelector("#waicolor111")
var yugu1 = document.querySelector("#yugu1")
var add1 = document.querySelector("#add1")

add1.onclick = function() {
	wainei11.innerHTML = nei1.innerHTML
	phone1.innerHTML = rn81.innerHTML
	waicolor111.innerHTML = color1.innerHTML
	two11.innerHTML = jia1.innerHTML
	wainei111.innerHTML = nei1.innerHTML
	waicolor11.innerHTML = color1.innerHTML
	forms1.classList.add("hide")
	yugu1.innerHTML = yu1.innerHTML
	var pros = one11.innerHTML * one22.innerHTML
	var findx5s = two11.innerHTML * numEle.innerHTML
	heji.innerHTML = pros + findx5s
	three.onclick = function() {
		if (numEle.innerHTML > 1) {
			numEle.innerHTML--
			var findx5s = two11.innerHTML * numEle.innerHTML
			heji.innerHTML = pros + findx5s - 10
			asd.innerHTML = pros + findx5s
		} else {
			alert("至少购买一件商品")
		}
	}
	four.onclick = function() {
		if (numEle.innerHTML < 2) {
			numEle.innerHTML++
			var findx5s = two11.innerHTML * numEle.innerHTML
			heji.innerHTML = pros + findx5s - 10
			asd.innerHTML = pros + findx5s
		} else {
			alert("限购两件商品")
		}
	}
}

var objallBtn = document.querySelector("#allbtn")
var objbtn1 = document.querySelector("#allbtn1")
var objbtn2 = document.querySelector("#allbtn2")
objallBtn.onchange = function() {
	objbtn1.checked = this.checked
	objbtn2.checked = this.checked
}
